<template>
  <el-config-provider :locale="locale" :size="size">
    <!-- 开启水印 -->
    <el-watermark
        v-if="watermarkEnabled"
        :font="{ color: fontColor }"
        :content="defaultSettings.watermarkContent"
        :z-index="9999"
        class="wh-full"
    >
      <router-view/>
    </el-watermark>
    <!-- 关闭水印 -->
    <router-view v-else/>
  </el-config-provider>
</template>

<script setup lang="ts">
import {useAppStore, useSettingsStore} from "@/store";
import defaultSettings from "@/settings";
import {ThemeEnum} from "@/enums/ThemeEnum";
import {SizeEnum} from "@/enums/SizeEnum";

const appStore = useAppStore();
const settingsStore = useSettingsStore();

const locale = computed(() => appStore.locale);
const size = computed(() => appStore.size as SizeEnum);
const watermarkEnabled = computed(() => settingsStore.watermarkEnabled);

// 明亮/暗黑主题水印字体颜色适配
const fontColor = computed(() => {
  return settingsStore.theme === ThemeEnum.DARK
      ? "rgba(255, 255, 255, .15)"
      : "rgba(0, 0, 0, .15)";
});
</script>

<style>
@media print {
  .has-logo, .fixed-header {
    display: none !important;
  }

  .hasTagsView {
    width: 100% !important;
    margin: 0 !important;
    overflow: visible !important;
  }

  section {
    overflow: visible !important; /* 打印时让内容完全显示，避免滚动条 */
  }
}

</style>
